<script>
    $(function() {
        $.each($("a.delete"), function(i, ele) {
            $(this).click(function() {
                $.post("/radio/music/delete_song/",
                { album_id : {{=album_id}}, 
                  song_id : $(this).attr("id")},
                function(data) {
                    $("div#songTable").html(data);
                    return false;
                });
            });
        });
    });
</script>
<table id="songs" class="zebra-striped">
    <thead>
        <tr>
            {{headers = ["Title","OK for Radio"]}}
            {{for h in headers:}}
            <th class="header">
                {{=h}}
            </th>
            {{pass}}
            <th class="header">Actions</th>
        </tr>
    </thead>
    <tbody>
        {{for song in songs:}}
        <tr>
            <td>
                {{=song.Name}}
            </td>
            <td>
                <div class="clearfix">
                    <div class="input">
                        <input id="visible"
                        name="visible" type="checkbox" 
                        {{if song.Visibility:}}
                        checked
                        {{pass}}
                        >
                    </div>
                </div>
            </td>
            <td>
                <a class="small btn danger delete" 
                    id="{{=song.SongID}}" 
                    href="#">delete</a>
            </td>
        </tr>
        {{pass}}

    </tbody>
</table>
